import 'package:afterclass01/pages/cart/index.dart';
import 'package:afterclass01/pages/category/index.dart';
import 'package:afterclass01/pages/home/index.dart';
import 'package:afterclass01/pages/mime/index.dart';
import 'package:flutter/material.dart';

class TabBarPage extends StatefulWidget {
  const TabBarPage({Key? key}) : super(key: key);

  @override
  _TabBarPageState createState() => _TabBarPageState();
}

class _TabBarPageState extends State<TabBarPage> {
  int currentIndex = 0;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: IndexedStack(
        index: currentIndex,
        children: [homeIndex(), categoryIndex(), carIndex(), mineIndex()],
      ),
      bottomNavigationBar: BottomNavigationBar(
        onTap: (index) {
          setState(() {
            currentIndex = index;
          });
        },
        //设置底部导航栏的字体颜色
        selectedItemColor: Colors.red,
        unselectedItemColor: Colors.grey,
        type: BottomNavigationBarType.fixed, //设置底部导航栏的类型
        currentIndex: currentIndex, //设置底部导航栏的当前索引
        items: [
          BottomNavigationBarItem(
            icon: Image.asset(
              'tabbar/home.png',
              width: 32,
              height: 32,
            ),
            activeIcon: Image.asset(
              'tabbar/home-active.png',
              width: 32,
              height: 32,
            ),
            label: '首页',
          ),
          BottomNavigationBarItem(
            icon: Image.asset(
              'tabbar/cate.png',
              width: 32,
              height: 32,
            ),
            activeIcon: Image.asset(
              'tabbar/cate-active.png',
              width: 32,
              height: 32,
            ),
            label: '分类',
          ),
          BottomNavigationBarItem(
            icon: Image.asset(
              'tabbar/cart.png',
              width: 32,
              height: 32,
            ),
            activeIcon: Image.asset(
              'tabbar/cart-active.png',
              width: 32,
              height: 32,
            ),
            label: '购物车',
          ),
          BottomNavigationBarItem(
            icon: Image.asset(
              'tabbar/user.png',
              width: 32,
              height: 32,
            ),
            activeIcon: Image.asset(
              'tabbar/user-active.png',
              width: 32,
              height: 32,
            ),
            label: '我的',
          )
        ],
      ),
    );
  }
}
